<!doctype html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./css/style.css">
    <link rel="stylesheet" href="./css/public.css">
    <script src="./js/rem.js" type='text/javascript'></script>
    <script type="text/javascript" src="./js/Imagelits.js"></script>
    <link rel="stylesheet" href="./css/public.css"/>
    <link rel="stylesheet" href="./css/animate.min.css"/>
    <link rel="stylesheet" href="./css/style.css"/>
    <!--    https://workathome.elloworld.com/Public/img/game_bg_5.jpg-->
</head>
<body>
<div id="wrapper">
    <!--  loading  -->
    <div class="loadpage page" style="display: none">
        <div class="xy50">
            <div class="loadnum">
                100%
            </div>
        </div>
    </div>

    <!--首页-->
    <div class="homepage pages hide">
        <div class="home_tit">
            <img src="./images/home_tit.png" alt="" class="home_tits" style="width: 6.22rem;">
            <div class="home_ico1"><img src="./images/home_ico1.png" class="" style="width: 2.89rem;"></div>
            <div class="home_ico3"><img src="./images/home_ico3.png" class="" style="width: 3.05rem;"></div>
            <img src="./images/home_tit2.png" class="home_tit2" style="width: 6.22rem;">
        </div>
        <div class="home_personage">
            <div class="" data-sex="b">
                <img src="./images/home_sex_ico_b.png" class="imgposition" style="width: 1.2rem;">
                <img src="./images/home_sex_bac.png" class="imgposition home_sex_ac" style="width: 1.2rem;">
                <img src="./images/home_sex_bbg.png" class="home_sex_av hide" style="width: 1.2rem;">
                <img src="./images/home_sex_b.png" class="home_sex_b home_sex_t hide"
                     style="width: 1.8rem; display: none;">
                <img src="./images/home_sex_btxt.png" class="home_sex_txt" style="width: 0.61rem;">
            </div>
            <div class="" data-sex="g">
                <img src="./images/home_sex_ico_g.png" class="imgposition" style="width: 1.2rem;">
                <img src="./images/home_sex_gac.png" class="imgposition home_sex_ac" style="width: 1.2rem;">
                <img src="./images/home_sex_gbg.png" class="home_sex_av hide" style="width: 1.2rem;">
                <img src="./images/home_sex_g.png" class="home_sex_g home_sex_t hide"
                     style="width: 1.78rem">
                <img src="./images/home_sex_gtxt.png" class="home_sex_txt" style="width: 0.59rem;">
            </div>
        </div>
        <div class="home_sextip"><img src="./images/home_sextip.png" class="" style="width: 2.6rem;"></div>
        <div class="home_btn hide"></div>
        <img src="./images/logo.png" alt="" class="home_logo" style="width: 4.12rem;">
    </div>

    <!--选择元素和场景-->
    <div class="gamepage pages">
        <div class="pageX">
            <canvas id="canvas" width="750" height="1496"></canvas>
        </div>
        <!--        新手教程-->
        <div class="pages game_tipbox">
            <div class="game_tip2"><img src="./images/game_tip2.png" class=" " style="width: 4.64rem;"></div>
        </div>
        <div class="game_ok"><img src="./images/game_ok.png" alt="" style="width: 1.67rem;"></div>
        <div class="game_Return"></div>
        <!--办公场景-->
        <div class="Scene_box">
            <div class="game_arrowL hide"></div>
            <div class="game_arrowR"></div>
            <div class="Scene_ok"><img src="./images/Scene_ok.png" alt="" style="width: 2.16rem;"></div>

            <div class="Scene_ico">
                <div class="game_Active"><img src="./images/Scene_ico1.png" class="xy50"></div>
                <div class=""><img src="./images/Scene_ico2.png" class="xy50"></div>
                <div class=""><img src="./images/Scene_ico3.png" class="xy50"></div>
                <div class=""><img src="./images/Scene_ico4.png" class="xy50"></div>
                <div class=""><img src="./images/Scene_ico5.png" class="xy50"></div>
            </div>
        </div>
        <!--办公姿势-->
<!--        <canvas id="DressCanvas" class="hide" width="690" height="640"></canvas>-->
        <canvas id="DressCanvas" width="690" height="640"></canvas>
        <div class="game_menubox hide">
            <div class="gametip hide"><img src="./images/tip.png" style="width: 2.85rem;"></div>
            <div class="game_menu">
                <div class="gameMenu_btn">
                    <div class="">
                        <img src="./images/game_btn1.png" style="width: 1.3rem; opacity: 1;">
                    </div>
                    <div class="">
                        <img src="./images/game_btn3.png" class="opacity" style="width: 1.3rem; opacity: 0;">
                    </div>
                    <div class="">
                        <img src="./images/game_btn2.png" class="opacity" style="width: 1.3rem; opacity: 0;">
                    </div>
                    <div class="">
                        <img src="./images/game_btn4.png" class="opacity" style="width: 1.3rem; opacity: 0;">
                    </div>
                    <div class="">
                        <img src="./images/game_btn6.png" class="opacity" style="width: 1.3rem; opacity: 0;">
                    </div>
                    <div class="">
                        <img src="./images/game_btn5.png" class="opacity" style="width: 1.3rem; opacity: 0;">
                    </div>
                </div>
                <div class="game_ico"><img src="./images/game_ico.png" style="width: 0.3rem;"></div>
            </div>
            <div class="game_icocont">
                <!-- 姿势-->
                <div class="gameicobox gameicobox1">
                    <div class="game_icobox game_icobox1">
                        <div class=""><img src="./images/posture_g1.png" class="xy50"></div>
                        <div class=""><img src="./images/posture_g2.png" class="xy50"></div>
                        <div class=""><img src="./images/posture_g3.png" class="xy50"></div>
                        <div class=""><img src="./images/posture_g4.png" class="xy50"></div>
                    </div>
                </div>
                <!--服装-->
                <div class="gameicobox gameicobox2" style="display: none;">
                    <div class="game_icobox game_icobox3">
                        <div class=""><img src="./images/Dress_ico_g1.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g2.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g3.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g4.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g5.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g6.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g7.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g8.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g9.png" class="xy50"></div>
                        <div class=""><img src="./images/Dress_ico_g10.png" class="xy50"></div>
                    </div>
                    <div class="game_arrowL hide"></div>
                    <div class="game_arrowR"></div>
                </div>
                <!--头部-->
                <div class="gameicobox gameicobox3 hide" >
                    <div class="game_arrowL hide"></div>
                    <div class="game_arrowR"></div>
                    <div class="game_icobox2">
                        <div class="game_hadebtn">
                            <img src="./images/hairdo_b_ico0.png" class="xy50" style="width: 1.6rem;">
                        </div>
                        <div class="game_hair">
                            <div class="game_Active"><img src="./images/hairdo_g_ico1.png" class="xy50">
                            </div>
                            <div class=""><img src="./images/hairdo_g_ico2.png" class="xy50"></div>
                            <div class=""><img src="./images/hairdo_g_ico3.png" class="xy50"></div>
                            <div class=""><img src="./images/hairdo_g_ico4.png" class="xy50"></div>
                            <div class=""><img src="./images/hairdo_g_ico5.png" class="xy50"></div>
                            <div class=""><img src="./images/hairdo_g_ico6.png" class="xy50"></div>
                            <div class=""><img src="./images/hairdo_g_ico7.png" class="xy50"></div>
                            <div class=""><img src="./images/hairdo_g_ico8.png" class="xy50"></div>
                        </div>
                        <div class="game_model">
                            <div class=""><img src="./images/expression_ico1.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico2.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico3.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico4.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico5.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico6.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico7.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico8.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico9.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico10.png" class="xy50"></div>
                            <div class=""><img src="./images/expression_ico11.png" class="xy50"></div>
                        </div>
                    </div>
                </div>
                <!--办公物-->
                <div class="gameicobox gameicobox4" style="display: none;">
                    <div class="game_icobox game_icobox4">
                        <div class=""><img src="./images/work_ico1.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico2.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico3.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico4.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico5.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico6.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico7.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico8.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico9.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico10.png" class="xy50"></div>
                        <div class=""><img src="./images/work_ico11.png" class="xy50"></div>
                    </div>
                    <div class="game_arrowL hide"></div>
                    <div class="game_arrowR"></div>
                </div>
                <!--干扰物-->
                <div class="gameicobox gameicobox5" style="display: none;">
                    <div class="game_icobox game_icobox5">
                        <div class=""><img src="./images/Pendant_ico1.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico2.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico3.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico4.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico5.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico6.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico7.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico8.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico9.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico10.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico11.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico12.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico13.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico14.png" class="xy50"></div>
                        <div class=""><img src="./images/Pendant_ico15.png" class="xy50"></div>
                    </div>
                    <div class="game_arrowL hide"></div>
                    <div class="game_arrowR"></div>
                </div>
                <!--挂件-->
                <div class="gameicobox gameicobox6" style="display: none;">
                    <div class="game_icobox game_icobox6">
                        <div class=""><img src="./images/Interferon_ico1.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico2.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico3.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico4.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico5.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico6.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico7.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico8.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico9.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico10.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico11.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico12.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico13.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico14.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico15.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico16.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico17.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico18.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico19.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico20.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico21.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico22.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico23.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico24.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico25.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico26.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico27.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico28.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico29.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico30.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico31.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico32.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico33.png" class="xy50"></div>
                        <div class=""><img src="./images/Interferon_ico34.png" class="xy50"></div>
                    </div>
                    <div class="game_arrowL hide"></div>
                    <div class="game_arrowR"></div>

                </div>
            </div>
        </div>

    </div>


</div>

<script src="./js/jquery-2.1.4.min.js" type='text/javascript'></script>
<script src="./js/easeljs-0.8.2.min.js" type='text/javascript'></script>
<script src="./js/touch.min.js" type='text/javascript'></script>
<script src="./js/tweenjs-0.6.2.min.js" type='text/javascript'></script>
<script src="./js/Imagelits.js" type='text/javascript'></script>
<script src="./js/share.js" type='text/javascript'></script>
<script src="./js/photo.js" type='text/javascript'></script>
<script src="./js/public.js" type='text/javascript'></script>
<script src="./js/app.js" type='text/javascript'></script>
</body>
</html>
